<template>
  <div class="notice">
    <div class="nt">{{ newNotice ? newNotice['notice_time'] : '' }}</div>
    <div>
      {{ newNotice ? newNotice['notice_content'] : '' }}
      <hr />
      <div class="link">
        <div class="list">
          <p @click="$router.push('/noticelist')" style="color: #0767ab">
            查看以往公告
          </p>
        </div>
        <div class="list">
          <p @click="$router.push('/eventlist')" style="color: #0767ab">
            查看事件列表
          </p>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import axios from 'axios'
const newNotice = ref({})
const getNotice = () => {
  axios.get('http://localhost:3000/notice/font').then((res) => {
    // console.log(res)
    const events = res.data.result
    newNotice.value = events[0]
    // console.log(newNotice.value)
  })
}
onMounted(() => {
  getNotice()
})
</script>

<style>
.notice {
  padding-left: 20px;
}
.nt {
  font-size: 10px;
  padding: 20px 0;
  color: gray;
}
.link {
  display: flex;
}
.list {
  padding: 0 23px 0 23px;
}
</style>
